{extend name="public:layout" /}

{block name="title"}
    <title>{:site('siteName')}-申请代理</title>
{/block}

{block name="css"}
    <style>
        .layui-form-label{width:60px;    padding: 9px 6px;}
        .layui-input-block{margin-left:75px;margin-right:10px;}
        .layui-form-item { margin-bottom: 9px;}
        .layui-input::-webkit-input-placeholder{ color: #999;font-size:12px;}
        .layui-input::-moz-placeholder{  color: #999;font-size:12px; }
        .layui-input:-ms-input-placeholder{color: #999;font-size:12px;}
    </style>
{/block}

{block name="content"}
    <div class="head">申请代理</div>
    <form class="layui-form" action="{:url('index/agent/apply')}" method="post">
        <div class="layui-form-item" style="margin-top: 15px">
            <label class="layui-form-label">用户名</label>
            <div class="layui-input-block">
                <input type="text" name="username" lay-verify="required|username" placeholder="请输入用户名" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-block">
                <input type="text" name="realname" lay-verify="required|realname" placeholder="请输入姓名" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">身份证号</label>
            <div class="layui-input-block">
                <input type="text" name="identity" lay-verify="required|identity" placeholder="请填写15或18位身份证号" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">销售顾问</label>
            <div class="layui-input-block">
                <input type="text" name="invitename" lay-verify="required" placeholder="请填写销售顾问" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">验证码</label>
            <div class="layui-input-block">
                <input type="text" name="code" lay-verify="required" placeholder="" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label"></label>
            <div class="layui-input-block">
                <img style="width: 200px;" src="{:captcha_src()}" alt="captcha" onclick="this.src='{:captcha_src()}'"/>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="checkbox" name="agreement" title="我已查看并同意代理协议" value="1" lay-filter="agreement" lay-skin="primary">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="hidden" name="__token__" value="{$Request.token}" />
                <button class="layui-btn layui-btn-danger login-btn" lay-submit lay-filter="go">确定申请</button>
            </div>
        </div>
    </form>
{/block}

{block name="script"}
    <script type="text/javascript">
        layui.use(['jquery','form','layer'], function(){
            var $ = layui.jquery;
            var form = layui.form();
            var layer = layui.layer;
            var agreement = '{:site("agencyAgreement")}';
            form.on('checkbox(agreement)', function(data){
                if(data.elem.checked){
                    layer.open({
                        type: 1,
                        title: '申请代理协议',
                        closeBtn: 1,
                        shadeClose: true,
                        resize:false,
                        move:false,
                        content: '<div style="margin: 20px;">'+agreement+'</div>'
                    });
                }
            });
            //注册表单验证
            form.verify({
                username: function(username){
                    if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(username)){
                        return '用户名不能含有特殊字符';
                    }
                    if(/(^\_)|(\__)|(\_+$)/.test(username)){
                        return '用户名首尾不能出现下划线\'_\'';
                    }
                    if(/^\d+\d+\d$/.test(username)){
                        return '用户名不能全为数字';
                    }
                },
                identity: function(identity){
                    if(identity.length !== 18){
                        return '身份证长度必须是18位';
                    }
                },
                realname: function(realname){
                    if(!/^[\u4E00-\u9FA5]+$/.test(realname)){
                        return '姓名必须是中文';
                    }
                }
            });
            form.on('submit(go)', function(data){
                if(!data.field.agreement){
                    layer.msg('请勾选申请代理协议');
                    return false;
                }
            });
        });
    </script>
{/block}